<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="email=no" name="format-detection"/>
    <meta content="telephone=no" name="format-detection" />
    <link href="__PUBLIC__/css/layout.css" type="text/css" rel="stylesheet" >
    <script src="__PUBLIC__/js/jquery-1.10.1.min.js"></script>
</head>
<body>
<div class="head">
    <div class="head-cont">
        <a href="javascript:$('#comment_frm').submit();"><span class="sch-qx">提交</span></a>
        <a href="javascript:history.back();"><i class="icon-iconfont-fanhui1"></a></i>
        <span class="head-tit">评价</span> </div>
</div>
<div class="page">
    <div class="h45"></div>
    <div class="dp-nav">
        <div class="dp-con">
            <ul id="comment_scores">
                <li>
                    <span class="dp-fen">0分</span>
                    <span class="dp-tit">治疗效果</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span>
                </li>
                <li><span class="dp-fen">0分</span><span class="dp-tit">性价比</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span></li>
                <li>
                    <span class="dp-fen">0分</span>
                    <span class="dp-tit">购买便利度</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span></li>
                <li>
                    <span class="dp-fen">0分</span>
                    <span class="dp-tit">服药便利度</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span></li>
                <li>
                <span class="dp-fen">0分</span>
                <span class="dp-tit">外包装</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span></li>
                <li>
                    <span class="dp-fen">0分</span>
                    <span class="dp-tit">副作用少</span>
                    <span class="star_info">
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                        <i class="icon-iconfont-star4"></i>
                    </span>
                </li>
            </ul>
        </div>
        <form id="comment_frm" action="/comment/drug/{$comment_drug}" method="post">
            <div id="hidden_score">
            <input type="hidden" value="0" id="cure" name="cure">
            <input type="hidden" value="0" id="price" name="price">
            <input type="hidden" value="0" id="buy" name="buy">
            <input type="hidden" value="0" id="use" name="use">
            <input type="hidden" value="0" id="package" name="package">
            <input type="hidden" value="0" id="side_effect" name="side_effect">
            </div>
        <div class="dp-con dp-con1">
            <ul>
                <li><span class="dp-fen"><i class="icon-iconfont-dibiao"></i></span><span class="dp-inp">
          <input type="text" name="drugstore" placeholder="请输入购买药店">
          </span><span class="dp-tit dp-tit1">购买药店</span></li>
                <li><span class="dp-fen">0分</span><span class="dp-inp">
          <input type="text" name="drug_price" placeholder="请输入购买价格">
          </span><span class="dp-tit dp-tit1">购买价格</span></li>
            </ul>
        </div>
        <div class="dp-con dp-con1">
            <div class="dp-text">
                <textarea id="comment_content" name="content" cols="" rows="" placeholder="说说你的感受吧"></textarea>
                <div class="font_count">已输入
                    <b id="count_number" class="red_font">0</b>个字
                    <span id="last_content" class="">，还需输入
                        <b class="green_font" id="last_number">30</b>个字符
                    </span>
                </div>
            </div>
        </div>
        <div class="dp-con"><span class="dp-conspan"><span  class="dp-radio"><span class="dp-radioyuan"></span>
            <input id="anonymous" name="anonymous" value="0" type="checkbox"></span>匿名评价</span></div>
        </form>
    </div>
</div>
<script type="text/javascript">

    $("input[name=dpradio]:checkbox").on("click",function(){
        if($(this).is(":checked")){
            $('.dp-radioyuan').show();
        }
        else{
            $('.dp-radioyuan').hide();
        }
    });

    $('.star_info i').on('click',function(){
        var index = $(this).index();
        lt_is = $(this).parent().find('i:lt('+index+')');
        gt_is = $(this).parent().find('i:gt('+ index +')');
        if($(this).hasClass('icon-iconfont-star4')) {
            lt_is.removeClass('icon-iconfont-star4').addClass('icon-iconfont-star3');
            $(this).removeClass('icon-iconfont-star4').addClass('icon-iconfont-star3');
        }else{
//            if(index == 0 ) {
//                $(this).removeClass('icon-iconfont-star3').addClass('icon-iconfont-star4');
//            }
            gt_is.removeClass('icon-iconfont-star3').addClass('icon-iconfont-star4');
        }
        $(this).parent().parent().find('.dp-fen').text($(this).parent().find('.icon-iconfont-star3').length+'分');
        $('#hidden_score input').eq($(this).parent().parent().index()).val($(this).parent().find('.icon-iconfont-star3').length)
    });

    $("#comment_content").bind('propertychange input', function () {
        count = $(this).val().length;
        if(count < 30 || count > 500){
            $("#count_number").addClass('red_font').text(count);
            $("#last_number").text(30-count);
            $("#count_number").removeClass("green_font");
            $("#last_content").removeClass('hidden_info');
        }else{
            $("#last_content").addClass('hidden_info');
            $("#count_number").removeClass('red_font');
            $("#count_number").addClass('green_font').text(count)
        }
    });

    $("#anonymous").click(function(){
        if($(this).attr('checked')){
            $(this).removeAttr('checked');
            $(this).val(0);
        }else{
            $(this).attr('checked',true);
            $(this).val(1);
        }
    })

</script>
</body>
</html>
